{% load staticfiles %}
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
	<script type="text/javascript" src="/static/js/jquery-1.11.3.js"></script>
    <script>
        function Up_one(id,value){
            {#alert(id);#}
            {#alert(value);#}
            var num = parseInt(document.getElementById("question_number").value);
            {#alert(id);#}
            {#alert(num);#}
            if (value=='-' && num>0)
                {
                    num--;
                    {#alert(num)#}
                    if (num==0){
                        num = {{ count }}
                    }
                }
            else if (value=='+')
                {
                    num++;
                    if (num > {{ count }}){
                        num = 1
                    }
                }
            document.getElementById("question_number").value = num;

            var form = new FormData();
            form.append("id",num);
            $.ajax({
                //几个参数需要注意一下
                type: "post",//方法类型
                dataType: "json",//预期服务器返回的数据类型
                url: "/myapp/addNext/" ,//url
                {#data: $('#form1').serialize(),#}
                data: form,
                processData:false,
                contentType:false,
                success:function(data){
                    alert(data)
                    window.clearInterval(timer);
                    console.log("over..");
                },
            });
        }
        var sign = 0
        function explain() {
   {
       sign = sign +1;
       {#alert(sign);#}
       if (sign <= 1)
       {
           var btn = document.createElement("div");
            //2、设置其文本为 ：动态创建的button
            btn.innerHTML="正确答案：{{ res.correct_option }}解析：{{ res.analysis }}";
            {#btn.innerHTML="";#}
            //3、为其绑定 click 事件
            btn.onclick=function(){
                console.log("这是一个纯动态创建出来的按钮");
            };
        //4、将 button 添加到 body 中
        document.body.appendChild(btn);
       }

	}
}
</script>
    <style>
        .table_box2 {
            height: 30px;
            width: 15px;
            border: none;
            {#float: left;#}
            zoom: 1;
            background-color: #ffffff;
            outline: medium;
        }
    </style>
</head>

<body>
<div class="com-mnks-question-detail" data-sp="0.27">
    <div class="detail-content" id="ComQuestionDetail_qundefined">
        <div class="timu">
            <p class="timu-text">考题：{{ res.title }}</p>
{#            <button class="btn-shoucang " ref="shoucang">收藏</button>#}
        </div>
        <div class="answer-w clearfix">
            <div data-questionid="803600" data-q-index="36" data-ismul="false" class="options-w left">
                <p ref="answerclick" data-a-label="A" class="">A、{{ res.option_A }}</p>
                <p ref="answerclick" data-a-label="B" class="">B、{{ res.option_B }}</p>
                <p ref="answerclick" data-a-label="C" class="">C、{{ res.option_C }}</p>
                <p ref="answerclick" data-a-label="D" class="">D、{{ res.option_D }}</p>
            </div>
        </div>
    </div>
    <div class="option-type-msg">
        <span>单选题，请选择你认为正确的答案！</span>
    </div>

</div>
<div class=" com-mnks-datika" data-sp="0.26">
    <div class="tool-bar"><div class="btn-bar clearfix">
        <button class="left gl" ref="pre" onclick="Up_one({{ res.id }},'+')">上一题</button>
        <input type="text" id="question_number" value="1" disabled="disabled" class="table_box2"/>/<input type="text" id="question_number" value="{{ count }}" disabled="disabled" class="table_box2"/>
        <button class="left gl" ref="next" onclick="Up_one({{ res.id }},'-')">下一题</button>
        <button class="right pt" ref="xiangqing" onclick="explain()">显示详解</button>
    </div>
        <div class="msg-bar clearfix">
            <label class="daduinext left">
                <input type="checkbox" checked="" class="checkbox-next">
                <span>&nbsp;答对自动下一题</span>
            </label><br>
            <span id="analysis">

            </span>
{#            <span class="left">#}
{#                <span class="gray">答对：</span>#}
{#                <span class="count-right" ref="xianshidatika">0&nbsp题</span>#}
{#            </span>#}
{#            <span class="left">#}
{#                <span class="gray">答错：</span>#}
{#                <span class="count-wrong" ref="xianshidatika">0&nbsp题</span>#}
{#            </span>#}
        </div>
    </div>
</div>
   </body>
</html>